import {
    Sidebar,
    SidebarContent,
    SidebarGroup,
    SidebarGroupContent,
    SidebarGroupLabel,
    SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem, SidebarProvider
} from "@/components/ui/sidebar";
import {Calendar, Search, Settings} from "lucide-react";

export default function testPage() {

    return (
        <SidebarProvider>
            <Sidebar side="right" collapsible="offcanvas">
                <SidebarHeader>属性</SidebarHeader>
                <SidebarContent>
                    <SidebarGroup>
                        <SidebarGroupLabel>Application</SidebarGroupLabel>
                        <SidebarGroupContent>
                            <SidebarMenu>
                                {[
                                    {
                                        title: "Calendar",
                                        url: "#",
                                        icon: Calendar,
                                    },
                                    {
                                        title: "Search",
                                        url: "#",
                                        icon: Search,
                                    },
                                    {
                                        title: "Settings",
                                        url: "#",
                                        icon: Settings,
                                    },
                                ].map((item) => (
                                    <SidebarMenuItem key={item.title}>
                                        <SidebarMenuButton asChild>
                                            <a href={item.url}>
                                                <item.icon/>
                                                <span>{item.title}</span>
                                            </a>
                                        </SidebarMenuButton>
                                    </SidebarMenuItem>
                                ))}
                            </SidebarMenu>
                        </SidebarGroupContent>
                    </SidebarGroup>
                </SidebarContent>
            </Sidebar>
        </SidebarProvider>
    )
}